<!doctype html>
<!--[if gt IE 8]><!-->
<html class="no-js" lang="">
	<!--<![endif]-->
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>学生端班级信息</title>
		<meta name="description" content="Ela Admin - HTML5 Admin Template">
		<meta name="viewport" content="width=device-width, initial-scale=1">

		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/normalize.css@8.0.0/normalize.min.css">
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.1.3/dist/css/bootstrap.min.css">
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css">
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/lykmapipo/themify-icons@0.1.2/css/themify-icons.css">
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pixeden-stroke-7-icon@1.2.3/pe-icon-7-stroke/dist/pe-icon-7-stroke.min.css">
		<link rel="stylesheet" href="assets/css/cs-skin-elastic.css">
		<link rel="stylesheet" href="assets/css/lib/datatable/dataTables.bootstrap.min.css">
		<link rel="stylesheet" href="assets/css/style.css">

		<!-- <script type="text/javascript" src="https://cdn.jsdelivr.net/html5shiv/3.7.3/html5shiv.min.js"></script> -->
		<script src="assets/js/vue.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="https://cdn.bootcdn.net/ajax/libs/axios/0.20.0/axios.min.js"></script>
	</head>
	<body>
		<!-- Left Panel -->

		<aside id="left-panel" class="left-panel">
			<nav class="navbar navbar-expand-sm navbar-default">

				<div id="main-menu" class="main-menu collapse navbar-collapse">
					<ul class="nav navbar-nav">

						<li class="menu-title">菜单</li><!-- /.menu-title -->
						<li>
							<a href="stu-dataOfClass.html"> <i class="menu-icon fa fa-users"></i>班级 </a>
						</li>
						<li class="menu-title">退出</li><!-- /.menu-title -->
						<li>
							<a href="login.html"> <i class="menu-icon fa fa-user-o"></i>退出登录 </a>
						</li>
					</ul>
				</div><!-- /.navbar-collapse -->
			</nav>
		</aside><!-- /#left-panel -->

		<!-- Left Panel -->

		<!-- Right Panel -->

		<div id="right-panel" class="right-panel">

			<!-- Header-->
			<header id="header" class="header">
				<div class="top-left">
					<div class="navbar-header">
						<a class="navbar-brand" href="#"><i class="menu-icon fa fa-user-circle fa-2x"></i></a>
					</div>
				</div>

			</header><!-- /header -->
			<!-- Header-->

			<div class="breadcrumbs">
				<div class="breadcrumbs-inner">
					<div class="row m-0">


					</div>
				</div>
			</div>


			<div class="content">
				<div class="animated fadeIn">
					<div class="row">
						<div class="col-md-12">
							<div class="card">
								<div class="card-header">
									<strong class="card-title">班级信息</strong>
								</div>

								<div class="card-body">
									<div class="content" id="tclass">
										<div class="animated fadeIn">
											<div class="row">
												<div class="col-md-4" v-for="(i,index) in classdatas">
													<aside class="profile-nav alt">
														<section class="card">
															<div class="card-header user-header alt bg-dark">
																<div class="media">
																	<div class="media-body">
																		<h2 class="text-light display-6">{{i.cname}}</h2>
																		<p>老师 {{i.tname}}</p>
																	</div>
																</div>
															</div>
															<div class="weather-category twt-category">
																<ul>
																	<li class="active">
																		<h5>{{i.cnum}}</h5>
																		课程成员
																	</li>
																	<li>
																		<h5>{{i.cnumber}}</h5>
																		作业次数
																	</li>
																	<li>
																		<h5>{{i.cid}}</h5>
																		课程编号
																	</li>
																</ul>
															</div>
															<div class="twt-write col-sm-12">
																<div style="text-align: center;">
																	<input class="btn btn-info" type="button" value="Select" @click="SelectClass(i.cid,i.cname)">
																</div>
															</div>
															<br>
														</section>
													</aside>
												</div>



											</div>
										</div>
									</div><!-- .content -->

									<!-- /#right-panel -->

									<!-- Right Panel -->

									<!-- Scripts -->
									<script src="https://cdn.jsdelivr.net/npm/jquery@2.2.4/dist/jquery.min.js"></script>
									<script src="https://cdn.jsdelivr.net/npm/popper.js@1.14.4/dist/umd/popper.min.js"></script>
									<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.1.3/dist/js/bootstrap.min.js"></script>
									<script src="https://cdn.jsdelivr.net/npm/jquery-match-height@0.7.2/dist/jquery.matchHeight.min.js"></script>
									<script src="assets/js/main.js"></script>


									
									<script src="assets/js/lib/data-table/dataTables.bootstrap.min.js"></script>
									<script src="assets/js/lib/data-table/dataTables.buttons.min.js"></script>
									<script src="assets/js/lib/data-table/buttons.bootstrap.min.js"></script>
									
									
									<script src="assets/js/lib/data-table/buttons.html5.min.js"></script>
									<script src="assets/js/lib/data-table/buttons.print.min.js"></script>
									<script src="assets/js/lib/data-table/buttons.colVis.min.js"></script>
									<script src="assets/js/init/datatables-init.js"></script>


									<script type="text/javascript">
										$(document).ready(function() {
											$('#bootstrap-data-table-export').DataTable();
										});
									</script>

									<script type="text/javascript">
										let vm = new Vue({
											el: '#tclass',
											data: {
												classdatas: []
											},
											mounted() {
												var username = window.localStorage.getItem('SUsername'); //获取登录后的教师Username
												// var classdata=1;
												// window.localStorage.setItem('test',classdata);
												axios.get(
														'http://172.81.214.138:8000/student_all_classes?username=' + username)
													//成功返回
													.then(response => {
														console.log(response);
														if (response.data.state == 1) {
															//alert('获取成功');
															//console.log(response);
															this.classdatas = response.data.data;
															console.log(this.classdatas);
														} else {
															alert('获取失败！');
														}
													})
													//失败返回
													.catch(error => {
														console.log(error);
													})
											},
											methods: {
												SelectClass(cid, cname) {
													//alert('现在你选择的班级是：'+cid);//验证选择
													window.localStorage.setItem('SselectClassName', cname);
													window.localStorage.setItem('SselectClass', cid); //存储cid
													console.log(window.localStorage.getItem('SselectClass'));
													window.location.assign('stu-dataOfHomeworktask.html');
												}
											}

										})
									</script>

	</body>
</html>
